import { useEffect, useState } from 'react'
// 处理数据请求和dom操作,等dom加载完成之后再请求数据
function App() {
  const [channels, setChannels] = useState([])
   useEffect(  () => {
     async function getData(){
       const res = await fetch('https://geek.itheima.net/v1_0/channels')
       const data = await res.json()
       setChannels(data.data.channels)
     }
     getData()
  }, [])
  return (
    <div className="App">
      <ul>
        {channels.map(item => <li key={item.id}>{item.name}</li> )}
      </ul>
    </div>
  )
}

export default App;

